<!doctype html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>托福人分类页</title>
    <link th:href="@{/css/base.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/css/toefl.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet" type="text/css">
    <script type="text/javascript" th:src="@{/js/lrtk.js}"></script>
</head>

<body>

<div class="doc1180 paddingT20 fn-clear">
    <!--页面左侧内容-->
    <div class="tfr_left">
        <form th:action="@{/cmt/getCmts/{artNo}(artNo=${artNo})}" method="post">
            <input type="submit" value="查询" style="display: none;"/>
        </form>
        <div class="tfr_Details">
            <div class="tfr_DetailsPl">
                <form th:action="@{/cmt/create/{artNo}(artNo=${artNo})}" th:object="${newComment}" method="post">

                    <div class="tfr_DetailsPlTop">
                        文章评论<span>18</span>
                        <span class="glyphicon glyphicon-heart" title="点击后关注"
                              style="float: right;right: 50px;font-size: 30px;color: red;"></span>
                    </div>
                    <div class="tfr_DetailsSr">
                        <textarea th:field="*{cmtText}" name="" cols="" rows="" class="tfr_DetailsInput"></textarea>
                    </div>
                    <div class="tfr_DetailsTj">
                        <dl>
                            <dt><a class="tfr_DetailsTjLink">登录</a>后参与评论</dt>
                            <dd><a onclick="$('input[name=\'submitCmt\']').click();" class="tfr_DetailsTjpl">提交评论</a>
                            </dd>
                        </dl>
                    </div>
                    <input name="submitCmt" type="submit" value="提交" style="display: none;"/>
                </form>
                <div class="tfr_DetailsMessage">
                    <ul>
                        <li th:each="comment,iterStat : ${page.list}" stat>
                            <div class="tfr_DetailsMPic">
                                <img width="125" height="125"
                                     th:src="@{/user/getAvatar/{userNo}(userNo=${comment.cmtUserNo})}">
                                <div class="tfr_DetailsMPicB"></div>
                            </div>
                            <div class="tfr_DetailsMText">
                                <div th:text="${comment.cmtText}" class="tfr_DetailsMTitle">评论内容</div>
                                <div class="tfr_DetailsName"><span><P
                                        th:text="${comment.getUser().userName}"></P></span>
                                    <p th:text="${comment.cmtDate}"></p>
                                </div>
                            </div>
                            <div class="tfr_DetailsLc">#16</div>
                        </li>
                    </ul>
                </div>
                <div class="pageList">
                    <ul>
                        <li> 共[[${page.total}]]条,
                            <span th:if="${ ( page.pageNum - 1 ) * page.pageSize + 1 == page.total }">
                        当前显示第[[${page.total}]]条,
                        </span></li>
                        <li>
                        <span th:if="${ ( page.pageNum - 1 ) * page.pageSize + 1 != page.total }">
                        当前显示[[${page.startRow}]]-[[${page.endRow}]]条,
                        </span>
                        </li>
                        <li>
                            第[[${page.pageNum}]]/[[${page.pages}]]页
                        </li>
                        <li>
                            <a href="#" th:if="${page.pageNum > 1}"><span class="linkspan" id="one">首页</span>&nbsp;</a>
                        </li>
                        <li>
                            <a href="#" th:if="${page.pageNum > 1}"><span class="linkspan" id="two">上一页</span>&nbsp;</a>
                        </li>
                        <li>
                            <a href="#" th:if="${page.pageNum < page.pages}"><span class="linkspan"
                                                                                   id="three">下一页</span>&nbsp;</a>
                        </li>
                        <li>
                            <a href="#" th:if="${page.pageNum != page.pages}"><span class="linkspan"
                                                                                    id="four">末页</span>&nbsp;</a>
                        </li>
                        <li>
                            到<input type="text" id="pageNo" size=4 style="text-align:right;"
                                    onkeypress="onlynumber();"/> 页
                            <button class="linkspan" id="five" style="color:black;text-decoration:none;"> 跳 转</button>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!--页面左侧内容 end-->

</div>

<script type="text/javascript" th:src="@{/js/jquery-3.1.1.min.js}"></script>
<script th:inline="javascript">
    $(function () {
        //删除操作
        $(".delete").click(function () {
            var href = $(this).attr("href");
            if (confirm("确定要删除吗?")) {
                $("form:eq(0)").attr("action", href).submit();
                return false;
            }

        });

        $("#newArticle").click(function () {
            var href = $(this).attr("href");
            $(location).attr("href", href);
        });

        //分页操作
        $(".linkspan").click(function () {

            var pageNo = [[${page.pageNum}]];
            var totalPageNum = [[${page.pages}]];
            var re = /^[0-9]+.?[0-9]*$/;

            if (String($(this).attr("id")) == String("one"))
                pageNo = 1;

            if (String($(this).attr("id")) == String("two"))
                pageNo = pageNo - 1;

            if (String($(this).attr("id")) == String("three"))
                pageNo = pageNo + 1;

            if (String($(this).attr("id")) == String("four"))
                pageNo = totalPageNum;

            if (String($(this).attr("id")) == String("five")) {
                var num = $.trim($("#pageNo").val());

                if (!re.test(num)) {
                    alert("输入的不是数字!");
                    return;
                }
                pageNo = parseInt(num);
                if (pageNo < 1 || pageNo > totalPageNum) {
                    alert("页号超出范围，有效范围：[1-" + totalPageNum + "]!");
                    return;
                }

            }

            var act = "?pageNo=" + pageNo;
            $("form:eq(0)").attr("action", act).submit();
            return false;

        });
    });

</script>

</body>
</html>
